import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import Tabs from '../../components/Tabs/Tabs'
import NeedItem from '../../components/NeedItem/NeedItem'
import BottomLine from '../../components/BottomLine/BottomLine'
import './needList.scss'
export default class Needlist extends Component {

  config = {
    navigationBarTitleText: '需求列表'
  }

  componentWillMount(e){
    Taro.request({
      url:"http://101.37.65.67/loudi-poc/demand/page",
      method:"GET"
    }).then(res=>{
      this.setState({
        data:res.data.data
      })
    })
  }

  state={
    tabs : [{ id: 1, value: '全部需求', isActive:true }, { id: 2, value: '审核失败', isActive:false }],
    data :[{
      id: "xxxxxxxxxxxxxxxxxx",
      customerName: "XXXXXXXXXXXXXXXX",
      guaranteeMode: 4,
      financingAmount: 100000,
      select: true,
      publishTime: "2020-01-13",
      publishTimeStamp: 1578910900650
    }]
  }

  handleTabsClick(e){
    // console.log('您好，这里是父组件news')
    // console.log(e);
    let {index} = e
    let {tabs} = this.state
    tabs.forEach((v,i)=>{v.isActive=v.id===index?true:false})
    this.setState({tabs})
  }

  to3splitAmount(financingAmount){
    financingAmount=financingAmount.toString();
    let str="";
    for(let i=0;i<financingAmount.length;i++){
      str=financingAmount[financingAmount.length-i-1]+str;
      if(i%3===2){str=','+str;}
    }
    if(str[0]===','){str=str.substr(1)};
    if(str==='')str='0'
    financingAmount='￥'+str;
    return financingAmount
  }

  productTypes=['','抵押',"质押","信保","一般保证","信用"]
  acceptCompanys=['安捷包装(娄底)有限公司','开关制造有限公司','丰立集团有限公司','国涟建设集团有限公司','恒腾建设科技有限公司','华芳集团金田纺织有限公司','百科医药有限公司','峰峰钨钼制品股份有限公司','广拓建设工程有限公司','国泰力天实业有限公司','华昌化工股份有限公司','健谷化工有限公司','金海岸海洋经济开发有限公司','金厦建设集团有限公司','隆力奇集团有限公司','梦兰集团有限公司','神州市政园林建设有限公司','省交通工程集团有限公司娄底分公司','苏北花卉股份有限公司','宿迁项王水利工程有限公司','娄底澄美皮件有限公司','娄底刚睿达机械设备有限公司','娄底佳辉化工有限公司']
  //创建新闻列表
  creatContent(){
    let {tabs,data} = this.state
    let needsContent=null
    if(tabs[0].isActive){
      needsContent=(
        <View>
          {
            data.map((e)=>{
              return e.select
              ? <NeedItem key={e.id} name={e.customerName} category={this.productTypes[e.guaranteeMode]+'贷款'} price={this.to3splitAmount(e.financingAmount)} time={'发布日期：'+e.publishTime} btnType='seeMore' url={'/pages/finance/financeConfirm/financeConfirm?nid='+e.id}></NeedItem>
              : <NeedItem key={e.id} name={e.customerName} category={this.productTypes[e.guaranteeMode]+'贷款'} price={this.to3splitAmount(e.financingAmount)} time={'发布日期：'+e.publishTime}  btnType='selectProduct' url={'/pages/chooseProduct/chooseProduct?id='+e.id}></NeedItem>
              
            })
          }
          <BottomLine></BottomLine>
        </View>
      )
    }else if(tabs[1].isActive){
      needsContent=(
        <View>
          {
            data.filter(e=>this.acceptCompanys.indexOf(e.customerName)===-1)
            .map((e)=>{
              return <NeedItem key={e.id} name={e.customerName} category={this.productTypes[e.guaranteeMode]+'贷款'} price={this.to3splitAmount(e.financingAmount)} time={'发布日期：'+e.publishTime} btnType='seeMore' url={'/pages/finance/financeConfirm/financeConfirm?nid='+e.id}></NeedItem>
            })
          }
          <BottomLine></BottomLine>
        </View>
      )
    }
    return needsContent
  }

  render () {
    //1 创建新闻列表
    let needsContent=this.creatContent()
    //2 渲染界面
    return (
      <View className='needList'>
        <Tabs tabs={this.state.tabs} onClick={this.handleTabsClick.bind(this)}>
          {needsContent}
        </Tabs>      
        {/* <View className='bottom_line'>分割线</View> */}
      </View>
    )
  }
}
